<template>
  <div class="app-container">
   <el-form ref="form" :model="form" label-width="80px">
  <el-form-item label="序号">
    <el-input v-model="form.index" style="width:50%" ></el-input>
    
  </el-form-item>

<el-form-item label="名称">
    <el-input v-model="form.name" style="width:50%"></el-input>
    
  </el-form-item>
 
    <el-button type="primary" @click="onSubmit" >立即创建</el-button>
  
</el-form>

  </div>
</template>

<script>
import  {addtable, getList} from '@/api/table'
export default {
     data() {
      return {
        form: {
          name: '',
          index: '',
        }
      }
    },
    mounted(){

      //
  
    },
    methods: {
      onSubmit() {
      if(this.form.index&&this.form.name){
          addtable({index:this.form.index, name:this.form.name}).then(res=>{
            console.log(res);
          this.$message({
                    message: '恭喜你，添加成功',
                    type: 'success'
                 });
                 this.form = {}
       })
      }else{
           this.$message.error('缺少必填信息');
      }

      },
     
    }   

 
}
</script>

<style scoped>
.el-button{
  margin-left: 100px;
}
</style>